<template>
	<view class="uploadcredentials">
		<view class="uploadcredentials-upload">
			<image class="uploadcredentials-upload-add"></image>
			<text class="uploadcredentials-upload-txt">点击上传支付凭证</text>
		</view>
		<text class="uploadcredentials-txt">点击并提交支付凭证</text>
		<view class="uploadcredentials-sjtel">
			<text class="uploadcredentials-sjtel-txt">商家手机</text>
			<view class="uploadcredentials-sjtel-input">
				<view class="uploadcredentials-sjtel-input-content">
					<input v-model="phone" class="uploadcredentials-sjtel-input-content-input" type="text" />
					<image @click="onClickClearTel" v-if="phone" class="uploadcredentials-sjtel-input-content-close"></image>
				</view>
			</view>
		</view>
		<view class="uploadcredentials-sjtel">
			<text class="uploadcredentials-sjtel-txt">实付金额</text>
			<view class="uploadcredentials-sjtel-input">
				<view class="uploadcredentials-sjtel-input-content">
					<input v-model="sellingPrice" class="uploadcredentials-sjtel-input-content-input" type="text" />
					<image @click="onClickClearED" v-if="sellingPrice" class="uploadcredentials-sjtel-input-content-close"></image>
				</view>
			</view>
		</view>
		<view class="uploadcredentials-sjtel">
			<text class="uploadcredentials-sjtel-txt">商家额度</text>
			<view class="uploadcredentials-sjtel-input">
				<view class="uploadcredentials-sjtel-input-content">
					<input v-model="facePrice" class="uploadcredentials-sjtel-input-content-input" type="text" />
					<image @click="onClickClearED" v-if="facePrice" class="uploadcredentials-sjtel-input-content-close"></image>
				</view>
			</view>
		</view>
		<text class="uploadcredentials-warn">*商家额度不是实际支付金额</text>
		<view class="uploadcredentials-btn">
			<button @click="add()" class="uploadcredentials-btn-content">提交确认申请</button>
		</view>
	</view>
</template>

<script>
	import { config } from '@/utils/config.js';
	export default {
		data() {
			return {
				storeId:'',//店铺id
				phone: '',//商家手机号
				sellingPrice: '',//实付金额
				facePrice:'',//额度
				voucherImage:'',//图片地址
				agent:{}
			}
		},
		onLoad() {
			this._getAgent()
		},
		methods: {
			onClickClearTel() {
				this.tel = ''
			},
			onClickClearED() {
				this.ed = ''
			},
			add(){
				let token = 'ROBOT ' + uni.getStorageSync('d_token');
				
				uni.request({
					url:`${config.api_base_url}agent/confirmation`,
					method: 'POST',
					header: {
						AUTH: token
					},
					data:{
						storeId:this.storeId,
						voucherImage:this.voucherImage,
						sellingPrice:this.sellingPrice,
						facePrice:this.facePrice,
						stordPhone:this.phone
					},
					success:res=>{
						console.log(res)
					}
				})
			},
			//通过token获取agent
			_getAgent(){
				let token = 'ROBOT ' + uni.getStorageSync('d_token');
				uni.request({
					url:`${config.api_base_url}agent/agent/findByToken`,
					method: 'POST',
					header: {
						AUTH: token
					},
					data:{},
					success:res=>{
						console.log(res)
						this.agent=res.data.data
					}
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #F7F5F6;
	}
</style>
<style scoped>
	.uploadcredentials {
		width: 100%;
		box-sizing: border-box;
		padding-top: 28rpx;
		padding-left: 24rpx;
		padding-right: 22rpx;
		display: flex;
		flex-direction: column;
	}
	.uploadcredentials-upload {
		width: 100%;
		height: 294rpx;
		background-color: #F0F0F0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		border-radius: 12rpx;
		border: 2rpx solid rgba(202, 202, 202, 1);
		box-sizing: border-box;
	}
	.uploadcredentials-upload-add {
		width: 46rpx;
		height: 46rpx;
		background-color: red;
		border-radius: 50%;
		margin-bottom: 26rpx;
	}
	.uploadcredentials-upload-txt {
		font-size: 24rpx;
		font-weight: 600;
		color: #999999;
		line-height: 34rpx;
	}
	.uploadcredentials-txt {
		font-size: 28rpx;
		font-weight: 600;
		color: #333333;
		line-height: 40rpx;
		box-sizing: border-box;
		padding-left: 26rpx;
		margin-top: 26rpx;
	}
	.uploadcredentials-sjtel {
		margin-top: 16rpx;
		box-sizing: border-box;
		padding-left: 26rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.uploadcredentials-sjtel-txt {
		font-size: 30rpx;
		font-weight: 600;
		color: #333333;
		line-height: 42rpx;
		margin-right: 20rpx;
	}
	.uploadcredentials-sjtel-input {
		flex: 1;
		height: 72rpx;
		box-sizing: border-box;
		padding-right: 22rpx;
	}
	.uploadcredentials-sjtel-input-content {
		width: 100%;
		height: 100%;
		border: 2rpx solid #dddddd;
		border-radius: 12rpx;
		background-color: #fff;
		display: flex;
		align-items: center;
	}
	.uploadcredentials-sjtel-input-content-input {
		margin: 0;
		padding: 0;
		width: calc(100% - 56rpx);
		height: 100%;
		box-sizing: border-box;
		padding-left: 18rpx;
		padding-right: 18rpx;
		font-size: 30rpx;
	}
	.uploadcredentials-sjtel-input-content-close {
		width: 30rpx;
		height: 30rpx;
		border-radius: 50%;
		margin-right: 26rpx;
		background-color: red;
	}
	.uploadcredentials-warn {
		margin-top: 26rpx;
		color: #F02230;
		line-height: 40rpx;
		font-weight: 500;
		font-size: 28rpx;
	}
	.uploadcredentials-btn {
		width: 100%;
		height: 100rpx;
		box-sizing: border-box;
		padding-left: 46rpx;
		padding-right: 44rpx;
		position: fixed;
		left: 0;
		bottom: 94rpx;
	}
	.uploadcredentials-btn-content {
		width: 100%;
		height: 100%;
		border-radius: 12rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #F02230;
		color: #fff;
		font-size: 28rpx;
		font-weight: 500;
	}
</style>
